<template>
 	<view class="zhuce">
 		<view class="zc_title">
 			<text>注册</text>
 			<view class="zc_ious"></view>
 		</view>

 		<view class="form">
 			<input class="form_input" type="text" placeholder-style="font-size: 30rpx;color: #B3B3B3;" v-model="username" :placeholder="userPlaceholder" @blur="checkvalue('username')" @focus='userPlaceholder = ""' />
 			<input class="form_input" type="password" placeholder-style="font-size: 30rpx;color: #B3B3B3;" v-model="password" :placeholder="pwdPlaceholder" @blur="checkvalue('password')" @focus='pwdPlaceholder = ""' />
 			<input class="form_input" type="password" placeholder-style="font-size: 30rpx;color: #B3B3B3;" v-model="repassword" :placeholder="pwdPlaceholder1" @blur="checkvalue('repassword')" @focus='pwdPlaceholder1 = ""' />
 			<text class="errtext">{{errmsg}}</text>
 			<button class="form_button" @click="zhuce" >注册</button>
 		</view>

 		<view class="zc_text">
 			<text class="dltext1">已有账号？</text><text class="dltext2" @click="theLogin">现在登录</text>
 		</view>

 	</view>
 </template>

 <script>
 	export default {
 		props: {},
 		data() {
 			return {
 				errmsg: '',
 				username: '',
 				password: '',
 				repassword: '',
				userPlaceholder: '请输入用户名',
				pwdPlaceholder: '请输入密码',
				pwdPlaceholder1: '请再次输入密码'
 			};
 		},
 		computed: {},
 		onLoad() {

 		},
 		onShow() {},
 		methods: {
 			theLogin() {
 				 uni.redirectTo({
 				 	url: "/pages/theLogin/index"
 				 }); 
				this.$emit('switchStatus',0)
 			},
 			checkvalue(value) {
 				var that = this;
 				const letter = /^[a-zA-Z0-9_-]{3,12}$/; //请填写3-12位数字、字母、下划线
 				const pwdletter = /^[a-zA-Z0-9_-]{6,16}$/;//请填写6-16位字符，不能包含空格
 				let username = that.username
 				let password = that.password
				let repassword=that.repassword
 				if (value == 'username' && username === '') {
 					that.errmsg = '用户名不能为空';
					that.userPlaceholder = '请输入用户名'
 				} else if (value == 'password' && password === '') {
 					that.errmsg = '密码不能为空';
					that.pwdPlaceholder= '请输入密码'
 				} else if (value == 'repassword' && repassword === '') {
 					that.errmsg = '确认密码不能为空';
					that.pwdPlaceholder1= '请再次输入密码'
 				} else if (password != repassword) {
 					that.errmsg = '两次密码不相同';
 				} 
				// else if (password === username) {
 			// 		that.errmsg = '账号密码不能一致';
 			// 	}
				else if(letter.test(username)==false){
 					that.errmsg = '请填写3-12位数字、字母、下划线';
 				}else if(letter.test(password)==false||letter.test(repassword)==false){
 					that.errmsg = '请填写3-16位字符，不能包含空格';
 				}
 				 else {
 					that.errmsg = '';

 				}
 			},
 			zhuce() {
				var _this=this;
				var doregisterdate={
					'username': _this.username,
					'password': _this.password
				}
				uni.request({
					url: 'http://taruinfo.work:8088/insertUser',
					data:doregisterdate,
					method:'POST',
					success:function(res){
						console.log(res.data)
						if(res.data.code == 200){
							uni.showToast({
								title:res.data.message,
								icon:'success'
							})
							setTimeout(function() {
								uni.redirectTo({
									url:'../theLogin/index'
								})
							},1500);
						}else{
							uni.showToast({
								title:res.data.message,
								icon:'none'
							})
						}
					}
				})
 				// var _this = this;
 				// uni.request({
 				// 	url: 'http://taruinfo.work:8088/insertUser',
 				// 	data: {
 				// 		'username': _this.username,
 				// 		'password': _this.password,
 				// 	},
 				// 	method: 'POST'
 				// }).then((res) => {
					// console.log(res[1].data.code)
					// if (res[1].data.code == 200) {
					// 	uni.showToast({
					// 	    title: res.data.message,
					// 		icon:"success"
					// 	});
 				// 		// uni.redirectTo({
 				// 		// 	url: '../theLogin/index'
 				// 		// })
 				// 	} else {
 				// 		uni.showToast({
 				// 			title: res.desc,
					// 		icon:'none'
 				// 		})
 				// 	}
 				// });
 				}
 		},
 	};
 </script>

 <style lang="less">
 	.zhuce {
 		.zc_title {
 			margin: 0 74rpx;
 			margin-top: 72rpx;

 			text {
 				font-size: 54rpx;
 				font-weight: 700;
 				color: #262626;
 			}

 			.zc_ious {
 				margin-top: -16rpx;
 				height: 14rpx;
 				width: 106rpx;
 				background-color: #88DFBA;
 				border-radius: 4rpx;

 			}
 		}

 		.form {
 			margin: 0 74rpx;
 			margin-top: 56rpx;
 			width: 630rpx;

 			.form_input {
 				width: 630rpx;
 				height: 110rpx;
 				border-bottom: 1rpx solid #cccccc;
 			}

 			.form_button {
 				margin-top: 98rpx;
 				background-color: #88DFBA;
 				border-radius: 8rpx;
 				height: 100rpx;
 				line-height: 100rpx;
 				font-size: 36rpx;
 				color: #FFFFFF;
 			}

 			.errtext {
 				margin-top: 26px;
 				font-size: 26rpx;
 				color: #f13535;
 			}
 		}

 		.zc_text {
 			position: absolute;
 			bottom: 129rpx;
 			width: 100%;
 			text-align: center;
 			font-size: 24rpx;

 			.dltext1 {
 				color: #b3b3b3;
 			}

 			.dltext2 {
 				font-size: 26rpx;
 				color: #3c78e6;
 			}
 		}
 	}
 </style>